<!--
 * @Description: 
 * @Author: zhangwei
 * @Date: 2023-03-17 20:55:48
 * @LastEditTime: 2023-03-18 08:22:15
 * @LastEditors: zhangwei
-->
<!--
    表单的校验规则在每个表单项上面，不统一添加
-->

<script lang="tsx">

import { PropType, defineComponent, unref } from 'vue'
import type { FormSchema } from "../../../types/lowcodeowcode"
import { formCmpMap } from '../../index'

export default defineComponent({
    name: 'ZwDescription',
    props: {
        schema: {
            type: Object as PropType<FormSchema>,
            default: function () { return {} }
        },
    },
    emits: [],
    setup(props,) {
        //watch()
        const renderWrap = () => {
            const { widgets = [], data } = unref(props.schema)
            return widgets.map(item => {
                const Com = formCmpMap[item.component as string] as ReturnType<typeof defineComponent>
                return (
                    <el-descriptions-item {...item.formItem} label={item.label}>
                        <Com schema={item} value={data[item.key]}></Com>
                    </el-descriptions-item>
                )
            })
        }

        return () => (
            <el-descriptions {...props.schema.attrs}>
                {{
                    default: function () {
                        return renderWrap()
                    }
                }}

            </el-descriptions>
        )
    }
})
</script>

<style lang="less" scoped></style>